<template>
	<div class="mainContent">
		<div class="bread-nav">
		    <span class="bread-item">供应商管理</span>
		    <span class="bread-icon">&gt;</span>
		    <span class="bread-item">物料管理</span>
		    <span class="bread-icon">&gt;</span>
		    <span class="bread-item activeNavs" @click="back">退料列表</span>
		    <span class="bread-icon">&gt;</span>
		    <span class="bread-item">新建退料单</span>
		</div>
		<!-- <pathTracking :path="Model.path" /> -->
		<div class="container">
			<el-row class="detailTable">
				<div class="detailTableItemTitle">
					<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
					<p class="text">退料单信息</p>
				</div>
				<!-- <el-form :inline="true">
					<el-col :sm="24" :md="12" :lg="8" :xl="6" v-for="(item,index) in Model.tableFormInline" :key="index">
						<el-form-item :label="item.label+'：'">{{item.value}}</el-form-item>
					</el-col>
				</el-form> -->
			</el-row>
			<el-row class="exports">
				<el-form :inline="true" class="demo-form-inline">
					<div v-on:keyup.enter="codeEntry">
						<el-form-item label="">
							<el-input v-model="Model.searchCode" placeholder="请输入条码/包码"></el-input>
						</el-form-item>
						<el-form-item>
							<el-button type="primary" @click="codeEntry">确定</el-button>
						</el-form-item>
					</div>
				</el-form>
			</el-row>
			<div class="batchDel">
				<div class="delBtn" @click="deleteTableData">删除</div>
			</div>
			<el-row class="detailTable">
				<div class="detailTableItemTitle">
					<img class="detailTableImgSmall" src="@/assets/img/flower_brown.png" alt="">
					<p class="text">退料物料明细 — 应退</p>
				</div>
				<div class="detailTableDetail">
					<el-table stripe :data="Model.tableData" border 
					 @selection-change="handleSelectionChange">
						<el-table-column align="center" type="selection" fixed="left" width="50"></el-table-column>
						<el-table-column align="center" v-for="(item,index) in Model.tableHeader" :key="index" :prop="item.prop"
						 :label="item.label" :width="item.width">
						</el-table-column>
						<el-table-column align="center" fixed="right" label='退料原因' width="180">
							<template slot-scope="scope">
								<div class="scopecont">
									<el-select v-model="scope.row.select" placeholder="请选择">
										<el-option v-for="item in Model.returnReason" :key="item.value" :label="item.label" :value="item.value">
										</el-option>
									</el-select>
								</div>
							</template>
						</el-table-column>
					</el-table>
				</div>
			</el-row>
			<el-row class="bottom">
				<div class="btn_group">
					<div class="btn_item" @click="onConfirm">确定退料</div>
					<div class="btn_item cancel" @click="onCancel">取消</div>
				</div>
			</el-row>
		</div>
		<!-- 弹框 -->
		<!-- <el-dialog :visible.sync="Model.editDialogFlag" top="100px" class="viewDialog">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">弹框</div>
			</div>
			<div style="padding:30px;background: #fff;">
				
			</div>
		</el-dialog> -->
		
	</div>
</template>

<script>
	import pathTracking from "@/components/common/pathTracking";
	import pagination from "@/components/common/pagination.vue";
	import advancedSearch from "@/components/common/filter/advancedSearch";
	import {
		getDateString
	} from "@/assets/js/common.js";
	import Model from "./model.js";
	import Controller from "./controller.js";
	export default {
		name: "purchase",
		mixins: [Model, Controller],
		components: {
			advancedSearch,
			pagination,
			pathTracking
		}
	};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
	@import "./index.less";
</style>
